/**
 * Created by oscar-yang on 2016/1/5.
 */
angular.module('directives.zTree', [])

// 封装树形菜单
.directive('zTree', [function () {
    return {
        templateUrl: 'directives/zTree/zTree.tpl.html'
        , priority: 1 // 设置调用优先级
        , restrict: 'AE'
        , replace: true
        , scope : {list : '@', ngModel : '=', newNode : '=', onAfterAddTreeNode : '&onAfterAddTreeNodeClick'}
        , link : function ($scope, element, attrs, ngModelCtrl) {

            var zTree = null; // 设定zTree对象

            var tree = angular.element('#treeDemo')
                , menu = angular.element('#rMenu');

            var mRootAdd = angular.element('#m-root-add')
                , mAdd = angular.element('#m-add')
                , mDel = angular.element('#m-del');

            var _beforeClick = function (treeId, treeNode, clickFlag) {
            };

            var _onClick = function (event, treeId, treeNode, clickFlag) {
                event.preventDefault();
                $scope.$apply(function () {
                    $scope.ngModel = treeNode;
                });
            };

            var _onRightClick = function (event, treeId, treeNode) {
                // 增加根节点
                if (!treeNode && event.target.tagName.toLowerCase() != "button" && angular.element(event.target).parents('a').length == 0) {
                    mRootAdd.show();
                    mAdd.hide();
                    mDel.hide();
                } else { // 增加子节点
                    mRootAdd.hide();
                    mAdd.show();
                    mDel.show();
                }
                showRMenu(event.clientX, $(document).scrollTop() + event.clientY);
            };

            var _onBodyMouseDown = function (event) {
                if (!(event.target.id == 'rMenu' || angular.element(event.target).parents('#rMenu').length > 0)) {
                    menu.css({'visibility' : 'hidden'});
                }
            };

            var showRMenu = function (x, y) {
                menu.show().css({
                    'top' : y + 'px'
                    , 'left' : x + 'px'
                    , 'visibility' : 'visible'
                });

                angular.element('body').unbind().bind('mousedown', _onBodyMouseDown);
            };

            var hideRMenu = function () {
                if (menu) menu.css({'visibility': 'hidden'});
                angular.element('body').unbind('mousedown', _onBodyMouseDown);
            };

            var addTreeNode = function (isLeaf) {
                if (!zTree) return;
                var newNode = { label : '新增菜单', 'isNew' : true};
                if (isLeaf) { // 添加子节点
                    newNode.checked = zTree.getSelectedNodes()[0].checked;
                    zTree.addNodes(zTree.getSelectedNodes()[0], newNode);
                } else { // 添加根节点
                    zTree.addNodes(null, newNode);
                }
                hideRMenu();
                // 双向绑定，并暴露接口
                $scope.newNode = newNode;
                if ($scope.onAfterAddTreeNode) $scope.onAfterAddTreeNode();
            };

            var resetTree = function () {
                hideRMenu();
                //$.fn.zTree.init($("#treeDemo"), setting, zNodes);
            };

            // 绑定数据集
            setTimeout(function () {
                var list = eval($scope.list);
                if (list) {
                    zTree = $.fn.zTree.init(tree, {
                        callback : {
                            beforeClick : _beforeClick
                            , onClick : _onClick
                            , onRightClick: _onRightClick
                        }
                    }, list);
                }
            }, 500);

            // 增加节点
            angular.element('#addRootNode').click(function () {addTreeNode(false);});
            angular.element('#addNode').click(function () {addTreeNode(true);});
        }
    };
}]);